<template>
	<view>
		<sww-swipe :list="swipeList" indicatorDots autoplay></sww-swipe>
		<view class="page_main" :style="{ '--color': vuex_config.themeColor1 }">
			<show-edit :detail="detail" :parameter="parameter" :adminOptin="adminOptin" :option="option"></show-edit>
			<!-- 参与情况 -->
			<view class="page_item" v-if="parameter.showPart == 1">
				<part-list :formId="detail.fk_custom_form_id"></part-list>
			</view>
			<view v-if="parameter.form.repeat_ill == 1" class="more_add">
				<text @click="goHistory" class="more_l">提交记录</text>
				<text @click="goAgainSub" v-if="!parameter.form.subNum || (parameter.form.subNum > detail.form_val_count)">再次提交</text>
			</view>
			<!-- 二维码 -->
			<view class="scan_box" v-if="parameter.showQr">
				<image :src="scanSrc" class="img"></image>
			</view>


			<template v-if="detail.total_amount && detail.pay_status == 0">
				<view class="fix_bot_main">
					<view class="fixed_bottom_btn">
						<view class="word" @click="startPay">立即支付</view>
					</view>
				</view>
			</template>
			<template v-else>
				<view class="fix_bot_main" v-if="parameter.examine == 1">
					<view class="fixed_bottom_btn">
						<view class="word">{{ examineObj[detail.status] }}</view>
					</view>
				</view>
				<view class="fix_bot_main" v-else-if="detail.sign_in == 1">
					<!-- 是否在签到时间内 -->
					<view class="fixed_bottom_btn">
						<view class="word" @click="goSign">{{ detail.sign_in_time ? '已签到' : '去签到' }}</view>
					</view>
				</view>
			</template>
			<sww-pay-class ref="payCheck" @callBack="onPayPrice"></sww-pay-class>
		</view>
	</view>
</template>

<script>
	import {
		payOrder
	} from '@/mixins/payOrder.js';
	import {
		wxConfig
	} from '@/mixins/wxConfig';
	import partList from '../components/partList.vue';
	import {
		resGet
	} from '@/common/http.request.js';
	import {
		edit
	} from '../edit.js';
	import showEdit from '../editComponents/showEdit.vue';
	import {
		mapState
	} from 'vuex';
	export default {
		mixins: [payOrder, wxConfig, edit],
		props: {
			detail: {
				type: Object,
				default: () => {
					return {};
				}
			}
		},
		components: {
			'part-list': partList,
			'show-edit': showEdit
		},
		data() {
			return {
				scanSrc: '', // 二维码
				examineObj: {
					0: '无需审核',
					1: '待审核',
					2: '已完成',
				}
			};
		},
		computed: {
			...mapState(['vuex_token'])
		},
		mounted() {
			this.initPage();
			this.getScanImg();
			// #ifdef H5
			this.initWxConfig(['chooseWXPay'])
				.then(() => {})
				.catch(() => {});
			// #endif
		},

		methods: {
			// 去签到
			goSign() {
				if (!this.detail.sign_in_time) {
					this.$linkTo('/package/activity/form/SignIn/index');
				}
			},
			// 查看历史记录
			goHistory() {
				this.$linkTo(`/package/activity/form/history/index?id=${this.detail.fk_custom_form_id}`);
			},
			// 重新提交
			goAgainSub() {
				let maxCount = this.parameter.form.subNum || 0
				if (maxCount > 0 && maxCount <= this.detail.form_val_count) {
					return
				}
				this.$emit('goAgainSub');
			},
			startPay() {
				this.$refs.payCheck.open(this.detail.total_amount);
			},
			// 开始支付
			onPayPrice(e) {
				let pay_type = e.pay_type
				let updateParams = {}
				if (obj.business_appid) {
					updateParams.business_appid = obj.business_appid
				}
				this.$loading();
				let opts = {
					totalPrice: this.detail.total_amount, // 支付金额
					order_type: 13, // 订单类型
					remark: '自定义表单订单', // 余额扣款备注
					updateApi: 'UpdateOrderStatus',
					pay_type: pay_type || 1, // 支付方式
					updateParams: {
						...updateParams
					}
				};
				this.setSubMsg().then(() => {
					this.judgeTypeToPay({
							pk_id: this.detail.order_id,
							order_no: this.detail.order_no
						}, opts)
						.then(() => {
							this.$emit('subFinsh');
						})
						.catch(err => {
							if (err) {
								this.$toast({
									title: err
								});
							}
						});
				});
			},
			getScanImg() {
				if (this.parameter.showQr != 1) return
				let obj = {
					url: '/package/activity/form/adminCheck/index',
					query: {
						business: this.vuex_business.pk_id,
						id: this.detail.fk_custom_form_id,
						users_id: this.vuex_token
					}
				};
				let str = JSON.stringify(obj);
				resGet('GenerateQRCode', {
					content: str
				}, {}, {
					blob: true
				}).then(res => {
					// #ifndef  MP-ALIPAY
					this.scanSrc = 'data:image/png;base64,' + uni.arrayBufferToBase64(res);
					// #endif
					// #ifdef  MP-ALIPAY
					this.scanSrc = 'data:image/png;base64,' + my.arrayBufferToBase64(res);
					// #endif
				});
			}
		}
	};
</script>
<style scoped lang="scss">
	.page_main {
		padding: 0 30rpx 20rpx;
		color: #000;
	}

	.page_item {
		margin-top: 20rpx;
		background-color: #fff;
		border-radius: 10rpx;
		overflow: hidden;
		border: 1px solid #eee;
	}

	.more_add {
		margin-top: 10rpx;
		padding: 10rpx 0;
		text-align: right;
		color: #315efb;
		text-decoration: underline;

		.more_l {
			padding-right: 20rpx;
		}
	}

	.scan_box {
		display: flex;
		justify-content: center;
		margin-top: 50rpx;

		.img {
			width: 300rpx;
			height: 300rpx;
		}
	}

	.fix_bot_main {
		height: 150rpx;
	}

	// 	.fixed_bottom_btn{
	// 		background-color: transparent;
	.word {
		background-color: var(--color);
	}

	// 	}
	// }
</style>
